// import React from 'react';
// import ReactDOM from 'react-dom';

import React from './lib/react';
import ReactDOM from './lib/react-dom';

class Counter extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      count: 0,
      label: '计数器'
    }
  }
  add = (ev, params) => {
    console.log('event:', ev)
    console.log('params:', params)
    this.setState({
      count: this.state.count + 1
    })
    console.log(this.state.count); // 0

    this.setState({
      count: this.state.count + 1
    })
    console.log(this.state.count); // 0
    setTimeout(() => {
      this.setState({
        count: this.state.count + 1
      })
      console.log('setTimeout', this.state.count); // 2

      this.setState({
        count: this.state.count + 1
      })
      console.log('setTimeout', this.state.count); // 3
    })
  }
  a () {
    alert(12)
  }
  render () {
    return (
      <div onClick={this.a} className="demo" style={{color: 'red'}}>
        Hello {this.props.name} ==={this.state.label}==={this.state.count}
        <button onClick={(e) => this.add(e, {name: 'timly', age: 888})}>+</button>
      </div>
    )
  }
}

const App = <Counter name="timly" />

ReactDOM.render(
  App,
  document.getElementById('root')
);

// 注意如果要使用老的把 jsx 编译成 React.createElement(), 必须在启动项中设置 cross-env DISABLE_NEW_JSX_TRANSFORM=true
// 如： "start": "cross-env DISABLE_NEW_JSX_TRANSFORM=true react-scripts start",